new Vue({
    el: ".profile",
    data: {
        userInfo: {},
        user: {},
        orders: "0",
        cars: "0",
        userAddress: "",
        updateUser: {},
        oldPassword: "",
        newPassword1: "",
        newPassword2: "",
        addressList: [],
        address: {
            addressStatus: "0"
        },
        orderList: [],
        commentList: [],
        collectInfo: []
    },
    methods: {
        findDetail: function () {
            axios({
                url: `/user/${this.userInfo.id}`,
            }).then(res => {
                if (res.data.flag) {
                    this.user = res.data.data.user;
                    this.orders = res.data.data.orders;
                    this.cars = res.data.data.cars;
                    this.updateUser = res.data.data.user;
                    if (res.data.data.address != null) {
                        this.userAddress = res.data.data.address.addressRegion;
                    }
                }
            })
        },
        uploadPic: function () {
            let from = new FormData();
            from.append("file", document.getElementById("picFile").files[0]);
            axios({
                method: 'post',
                url: "/user/uploadPic",
                headers: {
                    'content-type': 'multipart/form-data'
                },
                data: from
            }).then(res => {
                layer.msg(res.data.message);
                if (res.data.flag) {
                    this.user = res.data.data;
                    localStorage.setItem("loginUser", JSON.stringify(this.user));
                    document.getElementById("picFile").files[0] = null;
                }
            })
        },
        doUpdateUser: function () {
            if (JSON.stringify(this.updateUser) != "{}") {
                axios({
                    method: 'post',
                    url: "/user/updateUser",
                    data: this.updateUser
                }).then(res => {
                    layer.msg(res.data.message);
                    if (res.data.flag) {
                        this.user = res.data.data;
                        localStorage.setItem("loginUser", JSON.stringify(this.user));
                    }
                });
            }
        },
        updatePassword: function () {
            if (this.oldPassword != "") {
                if (this.newPassword1 === this.newPassword2 && this.newPassword1 != "") {
                    axios({
                        method: 'post',
                        url: "/user/updatePassword",
                        data: {
                            "oldPassword": this.oldPassword,
                            "newPassword": this.newPassword1
                        }
                    }).then(res => {
                        if (res.data.flag) {
                            layer.msg("密码修改成功,请重新登录。");
                            //清除本地储存
                            localStorage.removeItem("loginUser");

                            //清空cookie
                            $.removeCookie("userId", {path: "/"});
                            setInterval(() => {
                                location.href = "/login.html"
                            }, 1500);
                        } else {
                            layer.msg(res.data.message);
                        }
                    });
                } else {
                    layer.msg("两次密码不一致");
                }
            } else {
                layer.msg("旧密码不能为空");
            }
        },
        findAddress: function () {
            axios({
                url: "/address"
            }).then(res => {
                this.addressList = res.data.data;
            });
        },
        saveAddress: function () {
            if (JSON.stringify(this.address) != "{}") {
                this.address.addressRegion = $('#Map_input_callback').val();
                axios({
                    method: "post",
                    url: "/address",
                    data: this.address
                }).then(res => {
                    layer.msg(res.data.message);
                    if (res.data.flag) {
                        this.findAddress();
                        this.address = {};
                        $('#Map_input_callback').val("");
                    }
                });
            }
        },
        updateAddress: function (address) {
            console.log(`${$("#info").html()}`)
            layer.open({
                title: "修改地址",
                //调整弹框的大小
                area: ['50%', '60%'],
                shadeClose: true,//点击旁边地方自动关闭
                //动画
                anim: 2,
                //弹出层的基本类型
                type: 2,
                //刚才定义的弹窗页面
                content: "updateAddress.html", //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
                btn: ['修改', '取消'],
            });
        },
        updateStatus: function (aId) {
            axios({
                method: "put",
                url: `/address/updateStatus/${aId}`
            }).then(res => {
                layer.msg(res.data.message);
                if (res.data.flag) {
                    this.findAddress();
                }
            });
        },
        deleteAddress: function (aId) {

            layer.confirm('确定删除收货地址？', {
                btn: ['确定', '我再想想'], //按钮
                yes: () => {
                    axios({
                        method: "delete",
                        url: `/address/delete/${aId}`
                    }).then(res => {
                        layer.msg(res.data.message);
                        if (res.data.flag) {
                            this.findAddress();
                        }
                    });
                }
            });
        },
        toDetail: function (goodsId) {
            sessionStorage.setItem("goodsId", goodsId);
            location.href = "goodsDetail.html"
        },
        findOrder: function () {
            axios({
                url: "/order/findOrder"
            }).then(res => {
                this.orderList = res.data.data;
            });
        },
        doReceipt: function (orderId) {
            layer.confirm('确定收货？', {
                btn: ['确定', '取消'], //按钮
                yes: () => {
                    axios({
                        method: "put",
                        url: `/order/doReceipt/${orderId}`
                    }).then(res => {
                        layer.msg(res.data.message);
                        this.findOrder();
                    });
                }
            });
        },
        findComment: function () {
            axios({
                url: "/order/findComment"
            }).then(res => {
                this.commentList = res.data.data;
            });
        },
        doComment: function (orderId) {
            axios({
                method: "put",
                url: `/order/doComment/${orderId}`
            }).then(res => {
                layer.msg(res.data.message);
                this.findComment();
            });
        },
        findCollect: function (pageNum) {
            axios({
                url: `/goods/findCollect/${pageNum}`
            }).then(res => {
                if (res.data.flag) {
                    this.collectInfo = res.data.data;
                }
            });
        }
    },
    created: function () {
        this.userInfo = JSON.parse(localStorage.getItem("loginUser"));
        this.findDetail();
        this.findOrder();
    }
})